<template>
	<view class="message-detail">
		<view class="message-title">{{title}}</view>
		<view class="message-info">
			<view class="message-time">{{time}}</view>
			<view class="message-category">{{category}}</view>
		</view>
		<view class="message-content">
			<uParse :content="content" :loading="false"></uParse>
		</view>
	</view>
</template>

<script>
	import api from "@/utils/api/news/index.js"
	import uParse from '@/components/uParse/src/wxParse.vue';
	export default {
		components: {
			uParse
		},
		data() {
			return {
				id: 0,
				title: "",
				content: "",
				category: "系统公告",
				time: "",
			}
		},
		onLoad(e) {
			let data = JSON.parse(e.data)
			console.log(e.data)
			this.id = data.id;
			this.time = data.create_time;
			this.title = data.title;
			this.detail()
		},
		mounted() {
			uni.setNavigationBarTitle({
				title: this.title
			})
		},
		methods: {
			async detail() {
				let post = {
					id: this.id
				}
				let res = await api.detail(post)
				if (res.status == 1) {
					this.content = res.data;
				}
			}
		}
	}
</script>

<style lang="scss">
	view {
		display: flex;
		flex-direction: column;
		box-sizing: border-box;
		background-color: transparent !important;
	}

	page {
		background-color: #352E4D;
	}

	.message-detail {
		padding: 15px;

		.message-title {
			font-size: 22px;
			font-weight: bold;
			line-height: 110%;
		}

		.message-content {
			font-size: 16px;
			line-height: 180%;
			padding: 10px;
		}

		.message-info {
			flex-direction: row;
			border-bottom: 1px solid #473E68;
			padding-bottom: 10px;
			margin-bottom: 10px;

			.message-time {
				color: #999;
				margin-right: 15px;
			}

			.message-category {
				color: #666;
			}
		}
	}
</style>
